body {
  font: 14px "Century Gothic", Futura, sans-serif;
  height: 100vh;
  width: 100vw;
  background-image: url(./assets/background.png);
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden;
}
/* Header CSS */
.Header {
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.logo {
  width: 5vw;
  color: white;
  margin: 0 60px;
}
.navList {
  width: 50vw;
  height: 50px;
}
.navList > ul {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 80%;
  font-size: 16px;
  color: whitesmoke;
  padding-left: 0;
  cursor: pointer;
}
ul > li {
  list-style: none;
}
.navList > ul > li:hover {
  color: #ddd;
}
.userOption {
  display: flex;
  justify-content: flex-end;
  align-items: center;  
  text-align: right;
  width: 24vw;
  height: 80px;
}
.userOption>.userInfo{
  margin-right: 60px;
  font-size: 16px;
  color: whitesmoke;
  cursor: pointer;
}
.userOption>.userInfo:hover {
  color: #ddd;
}
.userOption>#btn_sign{
  border: none;
  height: 42px;
  width: 100px;
  border-radius:5px;
  background-color: #35BBED;
  color: #fff;
  cursor: pointer;
}
.userOption>#btn_sign:focus{
  border: none;
  outline: none;
}
.userOption>#btn_sign:active{
   transform: scale(0.9);
   transition: 0.3s;
}

/* Body CSS */
.Body {
  display: flex;
  justify-content: space-around;
  align-items: center;
  height: 80vh;
}
.leftBox,
.rightBox {
  width: 40vw;
}
.rightBox {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.rightBox > img {
  height: 600px !important;
}
.leftBox{
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  height: 600px;
}
.bigFont {
  font-size: 60px;
  width: 420px;
  color: white;
}
.secBigFont{
  font-size: 20px;
  width: 580px;
  color: white;
}
.searchBox{
  height: 200px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.searchBox>#searchBtn{
  border: none;
  height: 48px;
  width:160px;
  font-weight: 600;
  font-size: 16px;
  border-radius:5px 0 0 5px;
  background-color: #35BBED;
  color: #fff;
  cursor: pointer;
}
.searchBox>#searchBtn:focus{
  border: none;
  outline: none;
}
.searchBox>#searchBtn:active{
   transform: scale(0.9);
   transition: 0.3s;
}
.searchBox>#searchInput{
  background-color: transparent;
  border: 1px solid white;
  padding-left: 30px;
  height: 42px;
  width: 360px;
  color: white!important;
  cursor: pointer;
}
.searchBox>#searchInput:focus{
  outline: none;
}
/* WebKit browsers */
#searchInput::-webkit-input-placeholder {
    color: #C0C0C0;
    font-size: 16px;
}
/* Mozilla Firefox 4 to 18 */
#searchInput:-moz-placeholder {
    color: #C0C0C0;
    opacity: 1;
    font-size: 16px;
}
/* Mozilla Firefox 19+ */
#searchInput::-moz-placeholder {
    color: #C0C0C0;
    opacity: 1;
    font-size: 16px;
}
/* Internet Explorer 10+ */
#searchInput:-ms-input-placeholder {
    color: #C0C0C0;
    font-size: 16px;
}